<div class="page-title">
  <h4>自定义域名</h4>
  <a class="pull-right help-link" nzi-document-center [docTitle]="'自定义域名管理'">
    <i class="anticon anticon-question-circle-o"></i>自定义域名使用指南
  </a>
</div>
<div class="page-header">
  <p style="margin-bottom: 0;">自定义域名与 HTTP 触发器搭配使用，提供针对已有镜像的一键迁移，极速部署功能。</p>
</div>
<div class="padding-content area-col-white">
  <div class="table-top">
    <div class="table-operations clearfix">
      <div class="pull-left">
        <button nz-button nzType="primary" class="btn-add" (click)="createDomain()">
          <i class="fas fa-plus"></i>创建自定义域名
        </button>
      </div>
      <div class="pull-right"></div>
    </div>
  </div>
  <div style="padding-bottom:0.20rem;">
    <nz-table #nzTable [nzData]="domainList" [nzTotal]="totalCount" [nzShowTotal]="rangeTemplate"
      [(nzPageSize)]="pageSize" [(nzPageIndex)]="pageNo" nzShowSizeChanger [nzLoading]="isLoading"
      [nzFrontPagination]="false" [nzNoResult]="noResult" (nzPageIndexChange)="getDomainList()"
      (nzPageSizeChange)="getDomainList()" [nzShowPagination]="totalCount>10" class="table-fixed">
      <thead>
        <tr>
          <th>域名</th>
          <th nzWidth="2.5rem">支持协议</th>
          <th nzWidth="2rem">更新时间</th>
          <th nzWidth="1.6rem">操作</th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let data of nzTable.data; let i = index;">
          <td nz-popover [nzContent]="data?.domainName">{{data?.domainName}}</td>
          <td>{{data?.protocol}}</td>
          <td>{{(data.updateTime| date: 'yyyy-MM-dd HH:mm:ss') || '--'}}</td>
          <td class="table-opt">
            <a (click)="updateDomain(data)">配置</a>
            <a (click)="deleteDomain(data)">删除</a>
          </td>
        </tr>
      </tbody>
      <ng-template #noResult>
        <!-- <table-no-result-search></table-no-result-search> -->
        <table-no-result-add title="抱歉，你还没有自定义域名！" action="去创建" (actionClick)="createDomain()" >
        </table-no-result-add>

      </ng-template>
      <ng-template #rangeTemplate let-range="range" let-total>
        共{{totalCount}}条
      </ng-template>
    </nz-table>
  </div>
</div>